KnockoutJS তে Array Manipulation এর মাধ্যমে আপনি ডেটা ভ্যালু পরিবর্তন, অ্যারে থেকে আইটেম যোগ করা বা মুছে ফেলা, এবং অন্যান্য সাধারণ অপারেশন করতে পারবেন। KnockoutJS তে observable arrays ব্যবহৃত হয় যা UI এর সাথে সিঙ্ক্রোনাইজ হয়ে থাকে, এবং আপনি যদি এই অ্যারেগুলোর মধ্যে কোনো পরিবর্তন করেন, তবে সেই পরিবর্তন UI তে স্বয়ংক্রিয়ভাবে প্রতিফলিত হবে।
এখানে KnockoutJS তে Array Manipulation মেথডস (যেমন push(), pop(), remove(), ইত্যাদি) নিয়ে আলোচনা করা হয়েছে।
1. Observable Array:
KnockoutJS তে observable array একটি বিশেষ ধরনের observable যা অ্যারের মধ্যে ডেটার পরিবর্তন ট্র্যাক করতে সক্ষম। এটি স্বয়ংক্রিয়ভাবে UI কে আপডেট করে যখন অ্যারের মধ্যে নতুন আইটেম যোগ করা হয় অথবা কোনো আইটেম মুছে ফেলা হয়।
Observable Array তৈরি করা:
var myArray = ko.observableArray([1, 2, 3]);
এখানে, myArray একটি observable array যা {1, 2, 3} দিয়ে ইনিশিয়ালাইজ করা হয়েছে। এই অ্যারে তে ডেটা পরিবর্তন করলে UI তে স্বয়ংক্রিয়ভাবে পরিবর্তন দেখা যাবে।
2. Array Manipulation Methods in KnockoutJS
KnockoutJS তে আপনি অ্যারের বিভিন্ন অপারেশন করতে পারেন যেমন আইটেম যোগ করা, মুছে ফেলা, বা আইটেম আপডেট করা। এখানে কিছু সাধারণ মেথডের ব্যবহার দেখানো হয়েছে:
2.1. push() Method (আইটেম যোগ করা)
push() মেথডটি একটি নতুন আইটেম যোগ করার জন্য ব্যবহৃত হয়।
Example:
var myArray = ko.observableArray([1, 2, 3]);
// Adding a new item to the array
myArray.push(4);
console.log(myArray()); // Output: [1, 2, 3, 4]
এখানে:
push()ব্যবহার করে নতুন4আইটেমটি অ্যারেতে যোগ করা হয়েছে।
2.2. pop() Method (আইটেম অপসারণ)
pop() মেথডটি অ্যারের শেষের আইটেমটি মুছে ফেলে এবং সেই আইটেমটি রিটার্ন করে।
Example:
var myArray = ko.observableArray([1, 2, 3]);
// Removing the last item from the array
var removedItem = myArray.pop();
console.log(myArray()); // Output: [1, 2]
console.log(removedItem); // Output: 3
এখানে:
pop()ব্যবহার করে অ্যারের শেষের3আইটেমটি মুছে ফেলা হয়েছে এবং মুছে ফেলা আইটেমটিremovedItemভেরিয়েবলে সেভ করা হয়েছে।
2.3. shift() Method (প্রথম আইটেম অপসারণ)
shift() মেথডটি অ্যারের প্রথম আইটেমটি মুছে ফেলে এবং সেই আইটেমটি রিটার্ন করে।
Example:
var myArray = ko.observableArray([1, 2, 3]);
// Removing the first item from the array
var removedItem = myArray.shift();
console.log(myArray()); // Output: [2, 3]
console.log(removedItem); // Output: 1
এখানে:
shift()ব্যবহার করে অ্যারের প্রথম1আইটেমটি মুছে ফেলা হয়েছে এবং মুছে ফেলা আইটেমটিremovedItemভেরিয়েবলে সেভ করা হয়েছে।
2.4. unshift() Method (প্রথমে আইটেম যোগ করা)
unshift() মেথডটি অ্যারের প্রথমে একটি নতুন আইটেম যোগ করে।
Example:
var myArray = ko.observableArray([2, 3]);
// Adding a new item at the beginning of the array
myArray.unshift(1);
console.log(myArray()); // Output: [1, 2, 3]
এখানে:
unshift()ব্যবহার করে অ্যারের প্রথমে1আইটেমটি যোগ করা হয়েছে।
2.5. remove() Method (আইটেম মুছে ফেলা)
remove() মেথডটি একটি নির্দিষ্ট আইটেম বা আইটেমগুলিকে অ্যারে থেকে মুছে ফেলে।
Example:
var myArray = ko.observableArray([1, 2, 3, 4]);
// Removing a specific item from the array
myArray.remove(3);
console.log(myArray()); // Output: [1, 2, 4]
এখানে:
remove()মেথডটি3আইটেমটি অ্যারে থেকে মুছে ফেলেছে।
2.6. removeAll() Method (সব আইটেম মুছে ফেলা)
removeAll() মেথডটি অ্যারে থেকে সব আইটেম মুছে ফেলে।
Example:
var myArray = ko.observableArray([1, 2, 3, 4]);
// Removing all items from the array
myArray.removeAll();
console.log(myArray()); // Output: []
এখানে:
removeAll()মেথডটি অ্যারে থেকে সব আইটেম মুছে ফেলেছে এবং অ্যারে এখন খালি।
2.7. replace() Method (আইটেম প্রতিস্থাপন)
replace() মেথডটি একটি নির্দিষ্ট আইটেম প্রতিস্থাপন করতে ব্যবহার করা হয়।
Example:
var myArray = ko.observableArray([1, 2, 3]);
// Replacing item 2 with 4
myArray.replace(2, 4);
console.log(myArray()); // Output: [1, 4, 3]
এখানে:
replace()মেথডটি2আইটেমটি4দিয়ে প্রতিস্থাপন করেছে।
2.8. sort() Method (আইটেম সাজানো)
sort() মেথডটি অ্যারের আইটেমগুলি সাজানোর জন্য ব্যবহৃত হয়।
Example:
var myArray = ko.observableArray([4, 1, 3, 2]);
// Sorting the array in ascending order
myArray.sort(function(a, b) {
return a - b;
});
console.log(myArray()); // Output: [1, 2, 3, 4]
এখানে:
sort()মেথডটিmyArrayএর আইটেমগুলোকে ascending order-এ সাজিয়ে দিয়েছে।
সারাংশ:
- KnockoutJS তে observable arrays ব্যবহার করে আপনি অ্যারের মধ্যে আইটেম যোগ, মুছে ফেলা, আপডেট করা, এবং সাজানো সহ বিভিন্ন অপারেশন করতে পারেন।
push(),pop(),shift(),unshift(),remove(),removeAll(),replace(), এবংsort()এর মতো মেথড ব্যবহার করে আপনি অ্যারে ম্যানিপুলেশন করতে পারবেন।- Observables এর মাধ্যমে two-way data binding এর সুবিধা পাওয়া যায়, যেখানে অ্যারের মধ্যে পরিবর্তন হলে তা UI তে স্বয়ংক্রিয়ভাবে প্রতিফলিত হয়।
KnockoutJS এর observable arrays আপনাকে ডাইনামিক এবং ইন্টারঅ্যাকটিভ ইউজার ইন্টারফেস তৈরি করতে সহায়তা করে, যেখানে ডেটার পরিবর্তন UI তে দ্রুত এবং স্বয়ংক্রিয়ভাবে প্রতিফলিত হয়।
Read more
